<template>
  <div class="talk">
    <button @click="">点击获取一句土味情话</button>
    <ul>
      <li v-for="tk in talkStore.talkList" :key="tk.id">{{ tk.content }}</li>
    </ul>
  </div>
</template>

<script setup lang="ts" name="LoveTalk">
import { ref, reactive } from "vue";
import axios from "axios";
import { nanoid } from "nanoid";
import { useloveTalkStore } from "@/store/loveTalk";

const talkStore = useloveTalkStore();

// async function getLoveTk() {
//   //发请求
//   //连续解构赋值+重命名
//   let {
//     data: {
//       data: { content },
//     },
//   } = await axios.get("https://api.xygeng.cn/one");
//   //把请求回来的对象包装成一个对象

//   let obj = { id: nanoid(), content };
//   talkList.unshift(obj);
// }
</script>

<style scoped>
.talk {
  background-color: pink;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 0 0 10px;
}
</style>
